<template>
  <div class="supplierbox">
    <basic-container>
      <avue-crud
        ref="crud"
        :page.sync="page"
        :data="tableData"
        :table-loading="tableLoading"
        :option="option"
        @on-load="getList"
        @refresh-change="refreshChange"
        @search-change="searchChange"
        @size-change="sizeChange"
        @current-change="currentChange"
      >
        <template slot="menuLeft">
          <el-button type="primary" icon="el-icon-plus" size="small" @click="ToAdd">新增</el-button>
        </template>
        <template slot-scope="scope" slot="menu">
          <el-button icon="el-icon-delete" type="text" size="mini" @click="rowDel(scope.row)">删除</el-button>
          <el-button icon="el-icon-view" type="text" size="mini" @click="ToDetail(scope.row)">详情</el-button>
          <el-button icon="el-icon-edit" type="text" size="mini" @click="ToEdit(scope.row)">编辑</el-button>
          <el-button type="text" size="mini" icon="el-icon-edit" @click="commodity(scope.row)">商品</el-button>
        </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
// import { fetchList, delObj } from "./request";
import { tableOption } from "../../const/crud/supply/supplierList";
import {
  merchantInfo,
  fetchList,
  delObj
} from "../../api/supply/merchant_shop";

export default {
  components: {},
  data: function() {
    return {
      merchantInfoId: "",
      // 表格数据
      tableData: [],
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20, // 每页显示多少条
        isAsc: false // 是否倒序
      },
      tableLoading: false,
      // 表格配置
      option: tableOption
    };
  },
  mounted() {
    this.getHeight();
  },
  methods: {
    getHeight() {
      let tableHeight = Math.max(window.innerHeight - 330, 400);
      this.option.maxHeight = tableHeight + "px";
    },
    // 请求列表数据
    getList(page, params = {}) {
      this.tableLoading = true;
      params.current = page.currentPage;
      params.size = page.pageSize;
      fetchList(params).then(response => {
        console.log(response);

        this.tableData = response.data.data.records;
        this.page.total = response.data.data.total;
        this.tableLoading = false;
      });
    },
    /* 搜索回调
     */
    searchChange(form, done) {
      this.getList(this.page, form);
      done();
    },
    /**
     * 刷新回调
     */ refreshChange(info) {
      this.getList(this.page, this.filterForm(info.searchForm));
    },
    // 详情
    ToDetail(row) {
      let query = {
        res: {
          id: row.id
        }
      }
      this.$router.push({
        path: "supplierdetail",
        query:query
      });
    },
    // 编辑id
    ToEdit(row) {
      // console.log(id);
      let query = {
        res: {
          id: row.id
        }
      }
      this.$router.push({
        path: "supplieredit",
        query:query
      });
    },
    // 获取商家ID和店铺ID
    getMerchantID(data) {
      merchantInfo(data).then(res => {
        console.log(res);
        this.merchantInfoId = res.data.data.merchantId;
        this.shopId = res.data.data.shopId;
      });
    },
    // 商品
    commodity(row) {
      merchantInfo(row.id).then(res => {
        let query = {
          res: {
            merchantId: res.data.data.merchantId,
            shopId: res.data.data.shopId
          }
        };

        this.$router.push({ path: "/supply/supplygoods", query });
        console.log("merchantInfomerchantInfo", res, query);
      });
    },
    // 删除
    rowDel(row, index) {
      this.$confirm("是否确认删除", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        delObj(row.id);
        this.$message({ message: "删除成功", type: "success" });
        this.tableData.splice(index, 1);
      });
    },
    // 新增
    ToAdd() {
      this.$router.push({ path: "supplieradd" });
    },
    sizeChange(val) {
      this.page.currentPage = 1;
      this.page.pageSize = val;
      this.getList(this.page);
    },
    currentChange(val) {
      console.log(val);
      this.page.currentPage = val;
      this.getList(this.page);
    }
  }
};
</script>

<style lang="scss">
.supplierbox .el-form-item__label {
  padding-right: 6px;
}
</style>
